<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>任务分派-更新</title>

<link href="/css/ecalendar.css" rel="stylesheet" type="text/css">
<link href="/css/vendor/common.css" rel="stylesheet" type="text/css">
<link href="/css/vendor/cmp-controls.css" rel="stylesheet" type="text/css">
<link href="/css/vendor/page-control.css" rel="stylesheet" type="text/css">
<link href="/css/vendor/dispatch-mission.less" rel="stylesheet/less" type="text/css">
<script src="/js/less.min.js"></script>
</head>

<body>
<main>
    <!-- 地图显示块 -->
    <div class="map-wrap">
        <div id="map-container"></div>
        <div class="title-bar">北京测区-测区A-任务1 </div>
    </div>

    <!-- 左侧的主菜单 -->
    <div class="main-menu">
        <ul id="main-menu-list" class="menu">
            <li class="button" selected>任务信息</li>
            <li class="button">工程信息</li>
        </ul>

        <div id="mission-info-wrap">
            <p class="proj-name-title">工程名称:</p>
            <p class="proj-name">北京测绘北京测绘北京测绘北京测绘</p>
           
            <div class="area-title">测区A</div>
            <table class="mission" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="name">任务416546</td>
                    <td class="user"></td>
                    <td class="action button" onClick="dispatchMissionUpdateM.showUserSelection(event,this)">分派</td>
                </tr>
                <tr>
                    <td class="name">任务416</td>
                    <td class="user">吴超(已接收)12</td>
                    <td class="action button" onClick="dispatchMissionUpdateM.showUserSelection(event,this)"><img src="/images/dispatch-mission-retry.png">重新分派</td>
                </tr>
            </table>

            <div class="area-title">测区B</div>
            <table class="mission" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="name">任务4165464rjrttykhrjrjrtjtryjytjtuloyuloy;plup;ryherurturu</td>
                    <td class="user">ehwehyejerjtrjktyrjktykytkhrejherjtrrtjyt</td>
                    <td class="action button" onClick="dispatchMissionUpdateM.showUserSelection(event,this)">分派</td>
                </tr>
                <tr>
                    <td class="name">任务4165</td>
                    <td class="user">吴超(已接收)123456</td>
                    <td class="action button" onClick="dispatchMissionUpdateM.showUserSelection(event,this)"><img src="/images/dispatch-mission-retry.png">重新分派</td>
                </tr>
            </table>
            
            <p class="history-title">操作历史:</p>
            <table class="history" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="receiver">接收人</td>
                    <td class="dispatcher">分派人</td>
                    <td class="mission">任务</td>
                    <td class="time">时间</td>
                    <td class="comment">备注</td>
                </tr>
                <tr>
                    <td class="receiver">吴超564499869679769679679</td>
                    <td class="dispatcher">剑明dafwfwfw68588645547547</td>
                    <td class="mission">任务2348948949848984897987897987</td>
                    <td class="time">2017/10/20<br>16:50:30</td>
                    <td class="comment button"></td>
                </tr>
                <tr>
                    <td class="receiver">吴超56</td>
                    <td class="dispatcher">剑明da</td>
                    <td class="mission">任务23</td>
                    <td class="time">2017/10/20<br>16:50:30</td>
                    <td class="comment button" unread></td>
                </tr>
            </table>
            
        </div>

        <table class="bottom-bar">
            <tr>
                <td><p class="button">更 新</p></td>
                <td><p class="button">推送提醒</p></td>
            </tr>
            <tr>
                <td colspan="2">更新时间：2017-02-01 14:02:01<br>创建时间：2017-02-01 14:02:01</td>
            </tr>
        </table>

        <div id="project-info-wrap" class="remove">
            <h1>区块1-Mission 1</h1>
            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td class="name">飞机型号</td><td class="value">F300</td>
                    <td class="name"></td><td class="value"></td>
                </tr>
                <tr>
                    <td class="name">相机型号</td><td class="value">ILCE-5100</td>
                    <td class="name">航向重叠</td><td class="value">1220%</td>
                </tr>
            </table>

            <h1>区块1-Mission 2</h1>
            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td class="name">飞机型号</td><td class="value">F300</td>
                    <td class="name"></td><td class="value"></td>
                </tr>
                <tr>
                    <td class="name">相机型号</td><td class="value">ILCE-5100</td>
                    <td class="name">航向重叠</td><td class="value">1220%</td>
                </tr>
            </table>
        </div>
    </div>

    <!-- 人员选择列表 -->
    <div id="user-selection-page-mask" class="page-mask-container" style="visibility: visible;">
        <div id="user-selection-wrap" class="selection-wrap center-vh">
            <h1>人员选择</h1>
            <table class="condition">
                <tr>
                    <td><label class="name">昵称:</label><input type="text"></td>
                    <td><label class="name">邮箱:</label><input class="e-date" type="text"></td>
                    <td><label class="name">手机号:</label><input class="e-date" type="text"></td>
                </tr>
                <tr>
                    <td><label class="name">公司:</label><input type="text"></td>
                    <td>
                        <label class="name">省市:</label>
                        <select>
                            <option>全选择</option>
                            <option selected>湖南省</option>
                            <option>广西省</option>
                        </select>
                        <select>
                            <option>全选择</option>
                            <option>北京市</option>
                            <option selected>桂林市</option>
                        </select>
                    </td>
                    <td></td>
                </tr>
            </table>
            <div class="filter-btn button">筛 选</div>

            <div class="data-wrap">
                <div class="table-title-wrap">
                    <table class="title" cellpadding="0" cellspacing="0" border="0" bordercolor="#d8d8d8">
                        <tr>
                            <!-- 说明: selected属性使排序图片一直显示 sort属性设置排序方式，默认为降序desc  -->
                            <th class="width-200">昵称<img class="sort-icon" selected sort="asc"></th>
                            <th class="width-ud" style="width: 160px; min-width: 160px;">邮箱<img class="sort-icon" sort="desc"></th>
                            <th class="width-ud" style="width: 160px; min-width: 160px;">手机号<img class="sort-icon"></th>
                            <th class="width-150">公司<img class="sort-icon"></th>
                            <th class="width-100">省<img class="sort-icon"></th>
                            <!-- 预定义宽度类 width-s width-m width-b width-ud width-50 width-150 width-250 width-350 width-400 -->
                            <th class="width-100">市<img class="sort-icon"></th>
                            <!-- 自定义宽度需要 添加类width-ud 然后定义width和min-width的大小 -->
                            <th class="width-100">操作</th>
                        </tr>
                    </table>
                </div>
                <div class="table-data-wrap">
                    <table id="project-data-table" class="data" cellpadding="0" cellspacing="0" border="0" bordercolor="#d8d8d8">
                        <tr>
                            <td class="width-200">北京测绘</td>
                            <td class="width-ud" style="width: 160px; min-width: 160px;">2017-01-20 19:21:00</td>
                            <td class="width-ud" style="width: 160px; min-width: 160px;">2017-01-20 19:21:00</td>
                            <td class="width-150">深圳飞马</td>
                            <td class="width-100">广东省</td>
                            <td class="width-100">深圳市</td>
                            <td class="width-100"><span class="action button" onClick="dispatchMissionUpdateM.clickUserItemAction()">选择</span></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div> <!-- #user-selection-wrap -->
    </div> <!-- #user-selection-page-mask -->
</main>

<!--
<div id="comment-chat-box-mask">
    <div class="comment-chat-box center-vh">
        <table class="title-bar">
            <tr>
                <td class="info">任务A<span class="time">2017-10-18 17:55</span></td>
                <td class="state"><span class="submitted"></span>已接收</td>
            </tr>
        </table>
        
        <div class="msg-box">
            <ul class="msg-list" id="comment-chat-list">
                <li>
                    <p class="time">11-17 10:45</p>
                    <table class="msg-info" cellpadding="0" cellspacing="0">
                        <tr>
                            <td class="icon-wrap" valign="top"><img class="user-icon" src="images/web_error.png"></td>
                            <td valign="top">
                                <p class="name">Mickle Jodarn</p>
                                <div class="msg">
                                    你在哪里啊你在哪里啊你我不是不会和已回到Hi恢复IE4549848948944984984984194894984894897
                                </div>
                            </td>
                        </tr>
                    </table>
                </li>
                <li class="right-side">
                    <p class="time">11-17 10:45</p>
                    <table class="msg-info">
                        <tr>
                            <td valign="top">
                                <p class="name">Mickle Jodarn</p>
                                <div class="msg">
                                    你在哪里啊你在fjoejeojgioejiojnvoinvoie
                                </div>
                            </td>
                            <td class="icon-wrap" valign="top"><img class="user-icon" src="images/web_error.png"></td>
                        </tr>
                    </table>
                </li>
            </ul>
        </div>
        
        <div class="input-area">
            <textarea></textarea>
            <p class="send-btn button">发&nbsp;&nbsp;&nbsp;送</p>
        </div>
    </div>
</div>
-->
</body>

<script src="/js/jquery-3.2.1.min.js"></script>
<script src="/js/Ecalendar.jquery.min.js"></script>
<script src="/js/vendor/common.js"></script>
<script src="/js/vendor/cmp-controls.js"></script>
<script src="/js/vendor/page-control.js"></script>
<script src="/js/vendor/dispatch-mission-update.js"></script>
<script>
    // 备注聊天信息
    var commentData = {
        missionName: "任务B",
        dispatchTime: "2017-10-18 15:32",
        stateColor: "#4EA9FC",
        stateName: "已接收",
        msgs: [{
            time: "11-18 12:30",
            icon: "images/web_error.png",
            name: "Mikle Test",
            content: "你给我去飞这个任务吧得及缴费金额哦我个哦我结构7594739873489679",
            isLeft: true,
        },{
            time: "11-10 20:56",
            icon: "images/web_error.png",
            name: "NNNN AAA",
            content: "我才不要去呢",
            isLeft: false,
        }],
    };
    commentChatM.show(commentData, function(toSendData) {
        console.log(toSendData);
        commentChatM.clearInput();
    });
    commentChatM.sendBtnEnable(true);
    commentChatM.appendMsgs([{
            time: "11-18 12:30",
            icon: "images/web_error.png",
            name: "Mikle Test",
            content: "这是累加的数据",
            isLeft: true,
        },{
            time: "11-10 20:56",
            icon: "images/web_error.png",
            name: "NNNN AAA",
            content: "这是累加的数据",
            isLeft: false,
        }],);
    
    // 左侧菜单变化
    dispatchMissionUpdateM.mainMenuChangedToIndex = function(index) {
        console.log((index == 0) ? "切换到任务信息" : "切换到工程信息");  
    };
    
    // 人员选择分页控件
    var userPageControl = new PageControl("#user-selection-wrap", 100, 1000);
	userPageControl.refresh();
	userPageControl.pageDidChanged = function(page) {
		console.log("人员选择 页面改变了  " + page);
	}
    
    // 清空过滤条件
    // dispatchMissionUpdateM.clearFilter();
    
    // 日期控件
    var eDateItems = $(".e-date");
    for (var i = 0; i < eDateItems.length; i++) {
        var item = eDateItems[i];
        $(item).ECalendar({
             type:"date",   //模式，time: 带时间选择; date: 不带时间选择;
             stamp : false,   //是否转成时间戳，默认true;
             offset:[0,2],   //弹框手动偏移量;
             format:"yyyy/mm/dd",   //时间格式 默认 yyyy-mm-dd hh:ii;
             skin:3,   //皮肤颜色，默认随机，可选值：0-8,或者直接标注颜色值;
             step:10,   //选择时间分钟的精确度;
             callback:function(v,e){} //回调函数
        });
    }

</script>

</html>






